// BASE
$base-size: 8px;

// FONT
// Font family
$font-family-light: 'Museo Sans Light',
sans-serif;
$font-family-regular: 'Museo Sans Regular',
sans-serif;
$font-family-bold: 'Museo Sans Bold',
sans-serif;
$font-family-ultrabold: 'Museo Sans UltraBold',
sans-serif;

// Font size
$base-font-size: $base-size * 2;
$title-font-size: $base-font-size * 1.5;

// forms section
$form-border-color-focus: #04143c;
$label-color: #818994;

// 18px
$label-font-size: 1.125rem;
$input-font-size: 1.125rem;

// COLORS
$background-color: hsl(206, 7%, 95%);
// primary color palette
$primary-color-100: #DCEEFB;
$primary-color-200: #B6E0FE;
$primary-color-300: #84C5F4;
$primary-color-400: #62B0E8;
$primary-color-500: #4098D7;
$primary-color-600: #2680C2;
$primary-color-700: #186FAF;
$primary-color-800: #0F609B;
$primary-color-900: #0A558C;
$primary-color-1000: #003E6B;

//accent color pallete

$accent-color-100: #FFFBEA;
$accent-color-200: #FFF3C4;
$accent-color-300: #FCE588;
$accent-color-400: #FADB5F;
$accent-color-500: #F7C948;
$accent-color-600: #F0B429;
$accent-color-700: #DE911D;
$accent-color-800: #CB6E17;
$accent-color-900: #B44D12;
$accent-color-1000: #8D2B0B;

// neutrals color palette 
$neutral-color-100: #F0F4F8;
$neutral-color-200: #D9E2EC;
$neutral-color-300: #BCCCDC;
$neutral-color-400: #9FB3C8;
$neutral-color-500: #829AB1;
$neutral-color-600: #627D98;
$neutral-color-700: #486581;
$neutral-color-800: #334E68;
$neutral-color-900: #243B53;
$neutral-color-1000: #102A43;

// supportive color pallete
$supportive-color-cyan-100: #E0FCFF;
$supportive-color-cyan-200: #BEF8FD;
$supportive-color-cyan-300: #87EAF2;
$supportive-color-cyan-400: #54D1DB;
$supportive-color-cyan-500: #38BEC9;
$supportive-color-cyan-600: #2CB1BC;
$supportive-color-cyan-700: #14919B;
$supportive-color-cyan-800: #0E7C86;
$supportive-color-cyan-900: #0A6C74;
$supportive-color-cyan-1000: #044E54;

$supportive-color-green-100: #EFFCF6;
$supportive-color-green-200: #C6F7E2;
$supportive-color-green-300: #8EEDC7;
$supportive-color-green-400: #65D6AD;
$supportive-color-green-500: #3EBD93;
$supportive-color-green-600: #27AB83;
$supportive-color-green-700: #199473;
$supportive-color-green-800: #147D64;
$supportive-color-green-900: #0C6B58;
$supportive-color-green-1000: #014D40;

$supportive-color-red-100: #FFE3E3;
$supportive-color-red-200: #FFBDBD;
$supportive-color-red-300: #FF9B9B;
$supportive-color-red-400: #F86A6A;
$supportive-color-red-500: #EF4E4E;
$supportive-color-red-600: #E12D39;
$supportive-color-red-700: #CF1124;
$supportive-color-red-800: #AB091E;
$supportive-color-red-900: #8A041A;
$supportive-color-red-1000: #610316;


// text colors
$neutral-text-color: $neutral-color-1000;
$secondary-text-color: $neutral-color-300;

//error colors
$error-container-border-color: $supportive-color-red-100;
$error-container-background-color: $supportive-color-red-100;
$error-text-color: $supportive-color-red-700;


// status badges
$status-success-background-color: $supportive-color-green-200;
$status-success-text-color: $supportive-color-green-700;


$box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.2),
0px 1px 1px 0px rgba(0, 0, 0, 0.14),
0px 1px 3px 0px rgba(0, 0, 0, .12);